<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="https://www.thymeleaf.org" lang="en">
<head>
    <title>search</title>
    <link rel="stylesheet" type="text/css" href="/styles/engine.css">
</head>
<body>
<header>

    <div style="text-align: center;"><h1><a class="link" href="/helpEU">&#10068;</a>search</h1></div>
    <form action="/engine/me" method="get">
        <button id="home-button"></button>
    </form>
</header>
<div class="image-container-ford" th:if="${img != null}">
    <img th:src="${imgLogo}" alt="">
</div>
<form th:action="@{/car/find}" method="get">
    <div class="search-container">

        Example: Ford Focus <label for="search-input"></label><input type="text" id="search-input" name="model"
                                                                     placeholder="Brand model">
        Сar generation<label for="search-input2"></label><input type="text" id="search-input2" name="vehicleGeneration"
                                                                placeholder="Example: 1">
        <button id="search-button">Find</button>
    </div>
</form>

<div id="search-results">
    <span th:text="${error}"></span>
    <div class="image-container" th:if="${img != null}">
        <img th:src="${img}" alt="">

    </div>
    <div id="custom-text">

        <p><span th:text="${model}"></span></p>
        <p><span th:text="${price}"></span></p>
        <p><span th:text="${power}"></span></p>
        <p><span th:text="${engineCapacity}"></span></p>
        <p><span th:text="${maximumSpeed}"></span></p>
        <p><span th:text="${fullMass}"></span></p>
        <p><span th:text="${carClass}"></span></p>
        <form th:action="@{/api/car/add/favorite}" method="post" th:if="${idCar != null}">
            <input type="hidden" name="idCar" th:value="${idCar}" />
            <button id="favorite-button"></button>
        </form>
    </div>
</div>
    <footer>
       <p>&copy; 2024 Car-Engine</p>
        <div class="report-error-container">
            <form th:action="@{/report}" method="get">
            <button class="report-error-button">report to failed</button>
            </form>
        </div>
    </footer>
</body>
</html>